<!DOCTYPE html><!--lang="en" xmlns:th="http://www.thymeleaf.org"-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>Layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/css/business/layui.css" media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <script type="text/javascript" src="../js/business/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="../js/business/tc.min.js"></script>
    <script type="text/javascript" src="../js/business/tc.all.js"></script>


    <style type="text/css">
        body {
            margin: 0;
            padding: 0;
            font-size: 12px;
        }

        dt {
            padding: 10px;
        }

        i {
            font-style: normal;
        }

        /* detail */

        #detail {
            position: absolute;
            width: 900px;
            height: 600px;
            border: 1px solid #ccc;
            background: #efefef;
            display: none;
        }

        #detail .tit {
            background: #ddd;
            display: block;
            height: 33px;
            cursor: move;
        }

        #detail .tit i {
            float: right;
            line-height: 33px;
            padding: 0 8px;
            cursor: pointer;
        }

        /* detai2 */

        #detail2 {
            position: absolute;
            width: 300px;
            height: 100px;
            border: 1px solid #555;
            background: #555;
            display: none;
        }

        #detail2 .tit {
            background: #333;
            display: block;
            height: 33px;
            cursor: move;
        }

        #detail2 .tit i {
            float: right;
            line-height: 33px;
            padding: 0 8px;
            color: #777;
            cursor: pointer;
        }

        button {
            width: 85px;
            /*设置按钮宽度*/
            height: 30px;
            /*设置按钮高度*/
            color: white;
            /*字体颜色*/
        / / background-color: cornflowerblue;
            background-color: #2ABFAA;
            /*按钮背景颜色*/
            border-radius: 10px;
            /*让按钮变得圆滑一点*/
            border-width: 0;
            /*消去按钮丑的边框*/
            margin: 0;
            outline: none;
            /*取消轮廓*/
            font-family: KaiTi;
            /*字体设置为楷体*/
            font-size: 17px;
            /*设置字体大小*/
            text-align: center;
            /*字体居中*/
            cursor: pointer;
            /*设置鼠标箭头手势*/
        }

        button:hover {
            /*鼠标移动时的颜色变化*/
            background-color: antiquewhite;
        }

        .businessId {
            position: absolute;
            left: 75px;
            top: 95px;
        }

        .businessZh {
            position: absolute;
            left: 450px;
            top: 95px;
        }

        .businessMz {
            position: absolute;
            left: 75px;
            top: 155px;
        }

        .businessDh {
            position: absolute;
            left: 450px;
            top: 155px;
        }

        .businessYx {
            position: absolute;
            left: 75px;
            top: 215px;
        }

        .businessSj {
            position: absolute;
            left: 450px;
            top: 215px;
        }

        .businessSh {
            position: absolute;
            left: 75px;
            top: 275px;
        }

        .businessZj {
            position: absolute;
            left: 450px;
            top: 275px;
        }

        #ok {
            position: absolute;
            left: 175px;
            top: 480px;
        }

        /*
        分页
        */
        /*设置 a 标签的css样式*/
        .page-normal a {
            border: 1px solid #2ABFAA;
            padding: 5px 7px;
            color: #2ABFAA;
            margin-left: 20px;
            /*设置标签 a 之间的间隔*/
            text-decoration: none;
            /*去除页码数字下面的下划线*/
        }

        /*设置鼠标经过时 a 标签的css样式*/
        .page-normal a:hover {
            background-color: #ffbe94;
        }

        /*设置整个div的css样式,该样式主要用于设置网页内的省略号 …… 的样式，并且同时设置内容居中显示*/
        .page-normal {
            color: #2ABFAA;
            text-align: center;
        }

        /*设置当前页面的css样式*/
        .page-normal .page-current {
            color: #ffffff;
            background-color: #2ABFAA;
        }

        /*设置左单括号 < 的css样式*/
        .page-normal .page-prev {
            color: #2ABFAA;
        }

        /*进行代码优化，将不同css样式中共有的属性放在一起，有助于提高运行效率*/
        .page-normal a,
        .page-normal a:hover,
        .page-normal .page-prev,
        .page-normal .page-current {
            border: 1px solid #2ABFAA;
            padding: 5px 7px;
        }
    </style>


</head>

<body>

<table class="layui-hide" id="test"></table>
<br/>
<br/>
<h1 align="center">商家列表</h1>
<br/>
<form id="busForm" action="/merchant/businessAndPage">
    <div align="center">
        <h2><strong>查找商家: </strong>
            <input type="text" id="busName" placeholder="请输入要查询的企业名" th:value="${merchantname}" name="merchantname"/>
            <button type="submit">查询</button>
        </h2>
    </div>
</form>
<br/>
<table lay-filter="demo">
    <thead>
    <tr>
        <th lay-data="{field:'signid',width:180}">企业名</th>
        <th lay-data="{field:'username', width:240}">账号</th>
        <!--<th lay-data="{field:'experience', width:80, sort:true}">积分</th>-->
        <th lay-data="{field:'phone'}">电话</th>
        <th lay-data="{field:'eamil'}">邮箱</th>
        <!--<th lay-data="{field:'createDate'}">创建时间</th>-->
        <th lay-data="{field:'experience', sort:true}">状态</th>
        <th lay-data="{field:'details'}">详情</th>
    </tr>
    </thead>
    <tbody id="tbody">
    <tr th:each="bus :${merchantList}">
        <td class="merchantName" th:text="${bus.merchantName}" id="tbody_td">企业名</td>
        <!--<input type="text" id="id" class="idclass" name="ids" th:value="${bus.id}"  abc="abc">-->
        <td class="account" th:text="${bus.account}">账号</td>
        <!--<td>积分</td>-->
        <td class="phone" th:text="${bus.phone}">电话</td>
        <td class="eamil" th:text="${bus.eamil}">邮箱</td>
        <!--<td th:text="${bus.createDate}">创建时间</td>-->
        <td th:text="${bus.status}" class="stl">状态</td>
        <td>
            <button id="t1" onClick="tab(this)" class="button" name="id" th:data-id="${bus.id}"> 查 看</button>
        </td>
        <!--th:include="/merchant/businessAndId" -->
    </tr>
    </tbody>
    <p>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        0:是已经审批
        1:是等待审批
        2:是禁用商家
    </p>
</table>
<div id="detail">
    <div class="tit">
        <i class="close">❎</i>
    </div>
    <div>
        <h1 align="center">商家详细信息显示</h1><br/><br/><br/><br/>
        <h2>
            <span class="businessId" id="idl">ID：&nbsp</span>
            <span class="businessZh">账号：&nbsp;啧啧啧</span>
        </h2>
        <hr/>
        <br/><br/><br/>
        <h2>
            <span class="businessMz">商家名字：&nbsp;啧啧啧</span>
            <span class="businessDh">电话：&nbsp;啧啧啧</span>
        </h2>
        <hr/>
        <br/><br/><br/>
        <h2>
            <span class="businessYx">邮箱：&nbsp;啧啧啧</span>
            <span class="businessSj">创建时间：&nbsp;啧啧啧</span>
        </h2>
        <hr/>
        <br/>
        <h2>
		    <span class="businessSh">审核状态：&nbsp;
				<select class="businessZt" name="status" id="statusa">
					<option class="businessZt1" value="0">同意</option>
					<option class="businessZt2" value="1">待审批</option>
					<option class="businessZt3" value="2">禁用账号</option>
				</select>
			</span>
            <span class="businessZj">企业证件照：</span>
        </h2>
        <br/><br/><br/><br/>
        <button id="ok" class="close" onClick="Statusy()">确定修改</button>
    </div>
</div>
<!-- 分页 -->
<div class="page-normal">
    <a class="page-prev" th:if="${page.getCurrentPageNo() gt 1}"
       th:href="'/merchant/businessAndPage?pageIndex=' + ${page.getCurrentPageNo()- 1}+'&merchantname='+${merchantname}">&lt;</a>
    &lt;!&ndash; 数字1 代表当前页面&ndash;&gt;
    <a class="page-current" href="'/merchant/businessAndPage?pageIndex=1'">首页</a>
    <a href="/merchant/businessAndPage?pageIndex=2">2</a>
    <!-- <a href="/merchant/businessAndPage?pageIndex=3">3</a>-->
    <a th:href="'/merchant/businessAndPage?pageIndex=' + ${page.getTotalPageCount()-1}">最后一页</a>
    <a th:if="${page.getCurrentPageNo() lt page.getTotalPageCount()}"
       th:href="'/merchant/businessAndPage?pageIndex='+ ${page.getCurrentPageNo() + 1}">&gt;</a>
</div>

<script charset="utf-8" src="../js/business/layui.js"></script>
<script type="text/javascript" src="../js/business/layui.all.js"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->

<script>
    var table = layui.table;
    //转换静态表格
    table.init('demo', {
        height: 424 //设置高度
        ,
        //limit: 5 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
        //支持所有基础参数
    });


    var stu = document.getElementById("statusa");
    var stul = null;  //状态的值
    var sid = null;
    var hun = null;


    /*
    * 确定修改调用
    * */
    function Statusy() {
        $.ajax({
            type: "post",
            url: "/merchant/businessAndStatus",
            data: {status: stu.value, id: sid},
            error: function () {
                alert("修改失败！！！！！！！");
            },
            success: function (data) {
                var tdv = document.getElementsByClassName("data-id");
                //var aaa = $("data-id").parent().prev();
                var select_options = document.getElementById("statusa");//定位id
                var index = select_options.selectedIndex; // 选中索引
                var asd = select_options.options[index].value;// 选中值
                //alert(asd);
                hun.text("  " + asd);
            }
        });
    }

    /*
    * 查看调用
    * */
    function tab(obj) {

        hun = $(obj).parents("td").prev();

        var $businessId = $(obj).attr("data-id");
        $.ajax({ /*type:"请求方式", url:"请求路径", data:"请求参数",*/
            type: "get",
            url: "/merchant/businessAndId?id=" + $businessId,
            dataType: "json",
            error: function () {
                alert("查看操作失败");
            },
            success: function (merchant) {
                $(".businessId").text("编号: " + merchant.id);
                $(".businessZh").text("账号: " + merchant.account);
                $(".businessMz").text("名字: " + merchant.merchantName);
                $(".businessDh").text("电话: " + merchant.phone);
                $(".businessYx").text("邮箱: " + merchant.eamil);
                $(".businessSj").text("时间: " + merchant.createDate);
                sid = merchant.id;
                if (merchant.status == 0) {
                    $(".businessZt1").attr("selected", true);
                    stul = merchant.status;
                } else if (merchant.status == 1) {
                    $(".businessZt2").attr("selected", true);
                    stul = merchant.status;
                } else if (merchant.status == 2) {
                    $(".businessZt3").attr("selected", true);
                    stul = merchant.status;
                }
                var tu = merchant.imgUrl;
                $(".businessZj").html("<div>照片：<br/><br/><img src=" + tu + " width='320' height='160' /></div>");
            }
        });
        popWin("detail");
    }
</script>
</body>
</html>